<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <!---让 Bootstrap 开发的网站对移动设备友好--->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Thymeleaf test.</title>
    <!---
    <script th:src="@{js/ThymeleafJS.js}"></script>
    --->
    <!--- 引入JQuery --->
    <script type="text/javascript" src="js/jquery-3.6.0.min.js"></script>
    <!--- 引入bootstrap --->
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <script type="text/javascript" src="js/ThymeleafJS.js"></script>

</head>
<body>

<div th:replace="~{common::header}"></div>

<h1>人物简介</h1>
<p th:if="${name} eq admin">欢迎VIP会员</p>
<table>
    <tr th:each="item : ${map}">
        <td th:text="${item.key}">列值</td>
        <td th:text="${item.value}">列值</td>
        <td><button class="w-100 btn btn-lg btn-primary" th:value="${item.value}" onclick="btnClick()">123</button></td>
        <td><a th:href="@{http://www.baidu.com}">百度</a></td>
    </tr>
</table>

<h1>城市列表</h1>
<li th:each="city : ${list}" th:text="${city}">列表</li>

<div th:include="~{common::footer}"></div>

</body>
</html>